<template>
  <div class="page-container" >
    <div class="toolbar" style="padding-top:10px;padding-left:15px;" >
        <el-steps :active="active" align-center>
          <el-step title="基本信息" description=""></el-step>
          <el-step title="资质证书" description=""></el-step>
          <el-step title="提交申请" description=""></el-step>
        </el-steps>
        <el-row style="text-align: center;" v-show="active==1">
          <!-- table切换 -->
          <el-form :inline="true" :model="companyConcatForm" label-width="110px" style="text-align:center;" ref="companyConcatForm" :rules="dataFormRules" :size="size" class="form">
            <el-row style="margin-top: -20px;">
              <el-form-item label="ID" prop="id" v-if="false">
                <el-input v-model="dataForm.id" :disabled="true" auto-complete="off"></el-input>
              </el-form-item>
              <el-divider content-position="center">
                  <span style="font-size:16px;font-weight:800">
                    商家基本信息
                  </span>
              </el-divider> 
              <el-form-item label="商家编码"  prop="orgNumber">
                <el-input v-model="companyConcatForm.orgNumber" auto-complete="off"></el-input>
              </el-form-item>
              <el-form-item label="商家名称"  prop="name">
                <el-input v-model="companyConcatForm.name" auto-complete="off"></el-input>
              </el-form-item>
              <el-form-item label="商家类型"  prop="merchantType">
                <el-select v-model="companyConcatForm.merchantType" style="width:880px">
                  <el-option label="第三方入驻商家" value="2">第三方入驻商家</el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="账号"  prop="account">
                <el-input v-model="companyConcatForm.account" auto-complete="off"></el-input>
              </el-form-item>
              <el-form-item label="密码"  prop="password">
                <el-input v-model="companyConcatForm.password" auto-complete="off" show-password maxlength="18"></el-input>
              </el-form-item>
            </el-row>
            <el-row style="margin-top: -20px;">
            <el-divider content-position="center">
                <span style="font-size:16px;font-weight:800">公司信息</span>
            </el-divider>
            <el-form-item label="公司名称"  prop="companyName">
              <el-input v-model="companyConcatForm.companyName" auto-complete="off"></el-input>
            </el-form-item>
            <el-form-item label="法人姓名"  prop="legalPersonName">
              <el-input v-model="companyConcatForm.legalPersonName" auto-complete="off"></el-input>
            </el-form-item>
            <el-form-item label="法人证件号码"  prop="legalPersonIdNumber">
              <el-input v-model="companyConcatForm.legalPersonIdNumber" auto-complete="off" maxlength="18"
                   show-word-limit></el-input>
            </el-form-item>
            <el-form-item label="营业执照号码"  prop="businessLicenseNumber">
              <el-input v-model="companyConcatForm.businessLicenseNumber" auto-complete="off" ></el-input>
            </el-form-item>
            <el-form-item label="公司类型"  prop="companyType" >
              <el-select v-model="companyConcatForm.companyType">
                  <el-option label="民营" value="1">民营</el-option>
                  <el-option label="外资" value="2">外资</el-option>
                  <el-option label="合资" value="3">合资</el-option>
                  <el-option label="国企" value="4">国企</el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="经营范围"  prop="businessScope" >
              <el-input v-model="companyConcatForm.businessScope" auto-complete="off" type="textarea" style="width:880px"></el-input>
            </el-form-item>
            <el-form-item label="营业期限起"  prop="businessStart" >
              <el-date-picker v-model="companyConcatForm.businessStart" type="date"  placeholder="开始时间起" style="width:880px" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
            </el-form-item>
            <el-form-item label="营业期限止"  prop="businessEnd" >
              <el-date-picker v-model="companyConcatForm.businessEnd" type="date"  placeholder="开始时间止" style="width:880px" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
            </el-form-item>
            <el-form-item label="所属层级"  prop="level" >
              <el-input v-model="companyConcatForm.level" auto-complete="off"></el-input>
            </el-form-item>
            <el-form-item label="公司注册地址">
                <div style="width:880px">
                    <v-distpicker  :province="companyConcatForm.registeredProvinceId" :city="companyConcatForm.registeredCityId" :area="companyConcatForm.registeredRegionId" ></v-distpicker>
                </div>
            </el-form-item>
            <el-form-item label="详细地址"  prop="registeredDetailAddress" >
              <el-input v-model="companyConcatForm.registeredDetailAddress" auto-complete="off"></el-input>
            </el-form-item>
            <el-form-item label="公司注册资金"  prop="registeredCapital" >
              <el-select v-model="companyConcatForm.registeredCapital">
                  <el-option
                    v-for="item in registeredCapital"
                    :key="item.key"
                    :label="item.value"
                    :value="item.key"
                  ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="公司总人数"  prop="population" >
                <el-select v-model="companyConcatForm.population">
                  <el-option
                    v-for="item in population"
                    :key="item.key"
                    :label="item.value"
                    :value="item.key"
                  ></el-option>
              </el-select>
            </el-form-item>
            </el-row>

            <el-row style="margin-top: -20px;">
            <el-divider content-position="center">
                <span style="font-size:16px;font-weight:800">
                  联系信息
                </span>
            </el-divider>
            
            <el-form-item label="联系人姓名"  prop="contactName" >
              <el-input v-model="companyConcatForm.contactName" auto-complete="off"></el-input>
            </el-form-item>
          
            <el-form-item label="联系手机号"  prop="contactMobile" >
              <el-input v-model="companyConcatForm.contactMobile" auto-complete="off" maxlength="11"
                   show-word-limit></el-input>
            </el-form-item>
            <el-form-item label="联系人邮箱"  prop="contactEmail"  >
              <el-input v-model="companyConcatForm.contactEmail" auto-complete="off"></el-input>
            </el-form-item>
              <el-col :span="24">
                <el-form-item label="联系地址">
                  <div style="width:880px">
                    <v-distpicker  :province="companyConcatForm.contactAddressProvinceId" :city="companyConcatForm.contactAddressCityId" :area="companyConcatForm.contactAddressRegionId"></v-distpicker>
                  </div>
                </el-form-item>
              </el-col>

            <el-form-item label="详细地址"  prop="contactAddressDetail" >
              <el-input v-model="companyConcatForm.contactAddressDetail" auto-complete="off"></el-input>
            </el-form-item>
            </el-row>
          </el-form>
          <div class="item clearfix pt_10 mb_0">
            <el-checkbox id="check" type="checkbox" style="color: red" class="el-checkbox"></el-checkbox>
            <label for="js-mobile-check" class="txt_check_label gray">
                          我已阅读并同意
              <span @click="aleryTerm()">
                  <font color="blue">《{{this.terms}}》</font>
                </span>
            </label>
              
            <label for="js-mobile-check" class="txt_check_label gray">
              <el-checkbox type="checkbox" style="color: red;margin-left:100px" class="el-checkbox" :disabled="isAllowOperate" v-model="acchecked"></el-checkbox>
              <span>是否接受平台所有商品(勾选为是，默认否)</span>
            </label>
            <div slot="footer" class="dialog-footer" style="text-align:center">
              <br>
              <br>
              <el-button :size="size" type="primary" @click.native="returnLogin()">取消</el-button>
              <el-button :size="size" type="primary" @click.native="nextStep(1,'companyConcatForm')">下一步</el-button>
            </div>
          </div>
          <el-dialog title="商家入驻条款" width="40%" :center="true" :visible.sync="termModel" :close-on-click-modal="false">
            <el-form label-width="100px" :size="size" label-position="right" inline>
              <div class="contentStyle" v-html="content"></div>
            </el-form>
            <div slot="footer" class="dialog-footer" style="text-align:center">
              <el-button :size="size" @click="clearTermModel">{{$t('action.cancel')}}</el-button>
            </div>
          </el-dialog>
        </el-row>
        <el-row style="text-align: center;" v-show="active==2">
          <el-divider content-position="center">
              <span style="font-size:16px;font-weight:800">
                商家资质证书上传
              </span>
          </el-divider> 
          <div style="text-align: left;">
              <el-button :size="size" @click="addCertifications" type="primary" style="text-align:left;margin-bottom:10px;">添加资质证书</el-button>
          </div>
          <template>
            <el-table :data="tableDataCertifications" border style="width: 100%">
              <el-table-column prop="certificateName" label="证书名称" width="457"></el-table-column>
              <el-table-column prop="periodBegin" label="证书有效期" width="457">
                  <template slot-scope="scope">            
                  {{scope.row.periodBegin}}--{{scope.row.periodEnd}}
                  </template>
              </el-table-column>
              <el-table-column prop="fileUrl" label="	证书图片">
                  <template slot-scope="scope">            
                  <img :src="scope.row.fileUrl"  min-width="80" height="80" />
                  </template>  
              </el-table-column>
              <el-table-column	fixed="right" label="操作"	width="200">
                <template slot-scope="scope">
                    <!-- <el-button type="primary" size="small" @click="eidtCertificate(scope.row.id)">编辑</el-button> -->
                    <el-button type="danger" size="small" @click="deleteCertificate(scope.row.indexId)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
            <div class="item clearfix pt_10 mb_0">
              <div slot="footer" class="dialog-footer" style="text-align:center">
                <br>
                <br>
                <el-button :size="size" type="primary" @click.native="upStep(2)">上一步</el-button>
                <el-button :size="size" type="primary" @click.native="nextStep(2,null)">下一步</el-button>
              </div>
            </div>
          </template>
          <!-- 添加资质文件 -->
          <el-dialog title="添加资质文件" width="35%" :visible.sync="certificationModal" :close-on-click-modal="false" @closed="handleCloseCertificate">
            <el-form :model="certificationForm" label-width="130px" :rules="certificationRules" ref="certificationForm" :size="size"
              label-position="right" inline>
              <el-form-item label="ID" prop="id" v-if="false">
                <el-input v-model="certificationForm.id" :disabled="true" auto-complete="off"></el-input>
              </el-form-item>
              <el-row>
                <el-form-item label="证书名称" prop="certificateName">
                    <el-input v-model="certificationForm.certificateName"  auto-complete="off" style="width:350px"></el-input>
                </el-form-item>
          
                <el-form-item label="证书有效期起" prop="periodBegin">
                  <el-date-picker v-model="certificationForm.periodBegin" value-format="yyyy-MM-dd HH:mm:ss" style="width:350px">
                  </el-date-picker>
                </el-form-item>
                  <el-form-item label="证书有效期止" prop="periodEnd">
                  <el-date-picker v-model="certificationForm.periodEnd"  value-format="yyyy-MM-dd HH:mm:ss" style="width:350px">
                  </el-date-picker>
                </el-form-item>
                <el-form-item label="证书图片" prop="fileUrl">
                  <div style="float: left;">
                    <ul class="el-upload-list el-upload-list--picture-card">
                      <li
                        v-for="(bill_photo,index) in bill_photo_list"
                        :key="index"
                        :tabindex="index"
                        class="el-upload-list__item is-success"
                      >
                        <img :src="bill_photo" alt class="el-upload-list__item-thumbnail" />
                        <label class="el-upload-list__item-status-label">
                          <i class="el-icon-upload-success el-icon-check"></i>
                        </label>
                        <i class="el-icon-close"></i>
                        <span class="el-upload-list__item-actions">
                          <span class="el-upload-list__item-preview">
                            <i class="el-icon-zoom-in" @click="handlePictureCardPreview(null,bill_photo)"></i>
                          </span>
                          <span class="el-upload-list__item-delete">
                            <i class="el-icon-delete" @click="handleRemove(null,null,index)"></i>
                          </span>
                        </span>
                      </li>
                    </ul>
                  </div>

                  <el-upload :action="imgUpload" :on-success="handleAvatarSuccess" list-type="picture-card" v-model="certificationForm.fileUrl"
                    accept="image/gif, image/jpeg, image/jpg, image/png, image/svg"
                    :on-preview="handlePictureCardPreview" :on-remove="handleRemove" :limit="1" ref="upload"
                  >
                    <i class="el-icon-plus"></i>
                  </el-upload>
                  <el-dialog :visible.sync="dialogVisibleImage">
                    <img width="100%" :src="dialogImageUrl" alt />
                  </el-dialog>
                </el-form-item>
                  <el-form-item label="描述" prop="description">
                  <el-input v-model="certificationForm.description"  auto-complete="off" style="width:350px" type="textarea"></el-input>
                </el-form-item>
                
              </el-row>
              
            </el-form>
            <div slot="footer" class="dialog-footer" style="text-align:center">
              <el-button :size="size" @click="saveCertification"  type="primary">确认</el-button>
              <el-button :size="size" @click.native="certificationModal = false">{{$t('action.cancel')}}</el-button>
            </div>
          </el-dialog>
        </el-row>
        <el-row style="text-align: center;" v-show="active==3">
          <div style="height:100px">
            <label
              class="col-sm-7 control-label ng-binding"
              style="font-family: 'Arial Negreta', 'Arial';font-weight: 700;font-style: normal;font-size: 32px;color: #333333;"
            >申请成功，请耐心等待审核</label>
            <img v-bind:src="imgUrl" />
          </div>
          <div style="text-align:center;padding-top:130px;">
                <!-- <el-button :size="size" type="primary" @click.native="upStep(2)">上一步</el-button> -->
            <el-button :size="size" type="primary" @click="returnLogin">返回登录页</el-button>
          </div>
        </el-row>
    </div>
    
  </div>
</template>

<script>
import { mapState } from "vuex";
import Cookies from "js-cookie";
import ThemePicker from "@/components/ThemePicker";
import LangSelector from "@/components/LangSelector";
import Vue from "vue";
import VDistpicker from 'v-distpicker';
import {validatePhone,validateContacts,isEmail,isNumber} from '@/utils/validate'

export default {
  name: "Login",
  components: {
    ThemePicker,
    LangSelector,
    VDistpicker,
  },
  data() {
    return {
      imgUrl: "/static/u16.png",
      active:1,
      acchecked:false,
      termModel: false,
      isAllowOperate:false,
      content:"",
      terms:"",
      imgUpload: this.utils.getUpLoadHostForImg(),
      cid: this.$route.query.cid,
      storeid:this.$route.query.storeid,
      num:1,
      imageUrl: "",
      fileUrl:"",
      seniorityurl:"",
      seniorityurl2:"",
      seniorityurl3:"",
      size: "small",
      fileList: {},
      response: {},
      bill_photo_list: [],
      brandOptions: [],
      file: {},
      imgs: "",
      index: 1,
      registeredProvinceId:'',
      registeredCityId :'',
      registeredRegionId  :'',
      contactAddressProvinceId:'',
      contactAddressCityId  :'',
      contactAddressRegionId:'',
      provinceCode:'',
      cityCode  :'',
      regionCode:'',
      dataForm: {
        name: "",
        businesslicense: "",
        paperwork_photo: "",
        manager_photo: ""
      },
      registeredCapital: [
        { key: 1, value: "10万以下" },
        { key: 2, value: "10万-100万" },
        { key: 3, value: "100万-200万" },
        { key: 4, value: "200万-1000万" },
        { key: 5, value: "1000万以上" },
        ],
      population: [
      { key: 1, value: "10人以下" },
      { key: 2, value: "10人-50人" },
      { key: 3, value: "50人-100人" },
      { key: 4, value: "100人-500人" },
      { key: 5, value: "500人以上" },
      ],
       defaultProps: {
        children: "categoryList",
        label: "name"
      },
      categoryData: [],
      categoryids:[],
      categorycode:[],
      categoryname:[],
      dialogImageUrl: "",
      loading: false,
      dialogVisibleImage: false,
      certificationModal: false,
      dataFormRules: {
        orgNumber: [{required: true, message: "请输入商家编码", trigger: "blur"}],
        name: [{required: true, message: "请输入商家名称", trigger: "blur"}],
        merchantType: [{required: true, message: "请选择商家类型", trigger: "change"}],
        account: [{required: true, message: "请输入账号", trigger: "blur"}],
        password: [{required: true, message: "请输入密码", trigger: "blur"}],
        companyName: [{required: true, message: "请输入公司名称", trigger: "blur"}],
        legalPersonName: [{required: true, message: "请输入法人姓名", trigger: "blur"}],
        legalPersonIdNumber: [{required: true, validator: isNumber, trigger: "blur"}],
        businessLicenseNumber: [{required: true, validator: isNumber, trigger: "blur"}],
        businessStart: [{required: true, message: "请选择营业期限起", trigger: "blur"}],
        businessEnd: [{required: true, message: "请选择营业期限止", trigger: "blur"}],
        companyType: [{required: true, message: "请选择公司类型", trigger: "change"}],
        level: [{required: true, message: "请输入所属层级", trigger: "blur"}],
        registeredDetailAddress: [{required: true, message: "请输入详细地址", trigger: "blur"}],
        contactName: [{required: true, message: "请输入联系人姓名", trigger: "blur"}],
        contactMobile: [{required: true, validator: validatePhone, trigger: "blur"}],
        contactcontactEmail_email: [{required: true, message: "请输入联系人邮箱", trigger: "blur"}],
        contactAddressDetail: [{required: true, message: "请输入详细地址", trigger: "blur"}],
      },
      certificationRules:{
        certificateName: [{required: true, message: "请输入证书名称", trigger: "blur"}],
        periodBegin: [{required: true, message: "请输入证书有效期起", trigger: "blur"}],
        periodEnd: [{required: true, message: "请输入证书有效期止", trigger: "blur"}],
      },
      certificationForm:{},
      key:{},
      companyConcatForm:{
        orgNumber:'',
        name:'',
        merchantType:'',
        companyName:'',
        legalPersonName:'',
        legalPersonIdNumber:'',
        businessLicenseNumber:'',
        companyType:'',
        businessScope:'',
        businessStart:'',
        businessEnd:'',
        level:'',
        registered_detail_address:'',
        registeredDetailAddress:'',
        registeredCapital:'',
        population:'',
        contactName:'',
        contactMobile:'',
        contactEmail:'',
        contactAddressDetail:'',
        contactAddressProvinceId:'',
        contactAddressCityId:'',
        contactAddressRegionId:'',
        isAccept:0,
      },
      checked: true,
      certificationsList:{},
      tableDataCertifications: [],
      merchantsSettledFrom:{}
    };
  },
  methods: {
    //入驻条款查询
    getTermsInfo() {
      let this_ = this;
      let param = {};
      param.entryType = 1;
      this.utils.request.getTermsInfo(param, function(res) {
        if (res.data != null) {
          this_.terms = res.data.title;
          console.log(res.data);
          this_.content = res.data.content;
        }
      });
    },
    //入驻条款查看
    aleryTerm: function(data) {
      let this_ = this;
      this_.termModel = true;
    },
    //入驻条款关闭
    clearTermModel: function(data) {
      let this_ = this;
      this_.termModel = false;
    },
    //取消返回登录页面
    returnLogin(){
      this.$router.push("/login"); 
    },
    //上一步
    upStep(data) {
      if (data == 2) {
       this.active =1;
      }
    },
    //下一步
    nextStep(data,dataForm) {
      let this_=this
      if (data == 1) {//将数据保存 进入下一步添加资质证书
        this_.$refs[dataForm].validate((valid) => {
            if (valid) {
              if ($(".el-checkbox input[type='checkbox']").is(':checked') == false) {
                this.$message({message: '请阅读并勾选'+'《'+this.terms+'》', type: 'error'});return;
              }
              this.editLoading = true;
              let params = Object.assign({}, this.companyConcatForm);
              params.id=this_.cid
              params.storeid=this_.storeid
              console.log(this_.registeredProvinceId)
              params.registeredProvinceId=this_.registeredProvinceId
              params.registeredCityId=this_.registeredCityId
              params.registeredRegionId=this_.registeredRegionId
              params.contactAddressProvinceId=this_.contactAddressProvinceId
              params.contactAddressCityId=this_.contactAddressCityId
              params.contactAddressRegionId=this_.contactAddressRegionId
              if(this_.acchecked==true){
                params.isAccept=1
              }
              if(this_.acchecked==false){
                params.isAccept=0
              }
              this.merchantsSettledFrom = Object.assign({}, params);
              this.active =2;
            } else {
              console.log('error submit!!');
              return false;
            }
        });
      } else if (data == 2) {//将数据提交审核
        if(0==this.tableDataCertifications.length){
          this.$message({message: '请添加资质证书信息', type: 'error'});return;
        }
        if(2>this.tableDataCertifications.length){
          this.$message({message: '资质证书信息不得少于两条', type: 'error'});return;
        }
        this.merchantsSettledFrom.mCertificateList = this.tableDataCertifications;
        this.merchantsSettledFrom.deptId=1;
        this.merchantsSettledFrom.creator=1;
        console.log(this.merchantsSettledFrom);
        this_.utils.request.merchantsSettled(this.merchantsSettledFrom, function (res) {
          if (res.code == "0000") {
            this_.$message({ message: "操作成功", type: "success" });

            this_.$refs["companyConcatForm"].resetFields();
            this_.merchantsSettledFrom={};
            this_.active =3;
          } else if(res.code == "9999"){
            this_.$message({message: "操作失败, " + res.msg, type: "error"});return;
          }
        });
        
      }
    },
    //页面回显资质证书
    queryInfoCertifications(){  
       let this_=this;
       var query= {};
       if(this.cid !=null && this.cid !=0){
         query.merchantId=this_.cid
         query.deleteFlag=0
         this.utils.request.queryCertificateList(query, function (res) {
         if (res.data != null) {
            this_.tableDataCertifications=res.data
        }
       });
       }
    },
    //添加资质证书弹窗
     addCertifications (){
      this.certificationModal=true;
    },
    //资质证书保存至列表tableData
    saveCertification(){
        //  if(this.fileUrl== ''){
        //    this.$message({message:'请上传图片',type:'error'});return;
        //  }
          this.$refs.certificationForm.validate(valid => {
            if (valid) {
              let this_=this
              this.editLoading = true;
              let params = Object.assign({}, this_.certificationForm);
              var fileUrl = this_.fileUrl.split(",");
              //过滤多余的','
              params.fileUrl = fileUrl
                .filter(function(e) {
                  if (this_.utils.isNull(e)) {
                  } else {
                    return e;
                  }
                })
                .join(",");
              
              params.merchantId=this_.cid
              console.log(params);
              console.log(this.tableDataCertifications);
              if(this.tableDataCertifications.length==0){
                params.indexId = 0;
                this.tableDataCertifications.push(params);
              }else{
                params.indexId = this.tableDataCertifications.length;
                this.tableDataCertifications.push(params);
              }
              this.certificationModal=false;
            }
          });
    },
    //修改方法
    eidtCertificate(data){
      var this_=this
      this.certificationModal=true;
      let query={}
      query.id=data
      this.utils.request.queryCertificateList(query, function (res) {
         if (res.data != null) {
            this_.certificationForm=res.data[0]
            this_.bill_photo_list = this_.certificationForm.fileUrl.split(",");
            this_.certificationForm.fileUrl = "";
        }
       });
    },
    //资质证书数组删除
    deleteCertificate(indexId){
      this.$confirm("确认删除吗？", "提示", {}).then(() => {
        let this_=this;
        for(var i=0;i<this_.tableDataCertifications.length;i++){
          if(this_.tableDataCertifications[i].indexId==indexId){
            this_.tableDataCertifications.splice(i,1);
          }
        }
      });
    },
    clearFiles() {
      this.$refs["upload"].clearFiles();
    },
    handleCloseCertificate() {
      this.fileUrl="";
      this.clearFiles();
      this.certificationForm={},
      this.bill_photo_list = [];
      this.$refs.certificationForm.resetFields();
    },
    //图片移除
    handleRemove(file, fileList, index) {
      if (this.utils.isNull(index)) {
        this.fileList = fileList;
        if (fileList.length == 0) {
          this.fileUrl = "";
        } else {
          this.imgs = fileList
            .map(item => item.response.data.imgUrl)
            .toString();
          this.fileUrl = this.imgs;
        }
      } else {
        this.bill_photo_list.splice(index, 1);
      }
      console.log(this.fileUrl);
    },
   //处理图片卡预览
    handlePictureCardPreview(res, file) {
      this.dialogImageUrl = file;
      this.dialogVisibleImage = true;
    },
    //上传成功回调
    handleAvatarSuccess(res, file) {
      var this_=this
      if (res.data.imgUrl == "") {
        this_.$message({ message: "上传失败", type: "error" });
      } else {
        this_.fileUrl += res.data.imgUrl + ",";
        console.log(this_.fileUrl);
        this.imageUrl = URL.createObjectURL(file.raw);
      }
    },
  },
  mounted() {
    this.getTermsInfo();
    this.queryInfoCertifications();
  },
  computed: {
    ...mapState({
      themeColor: state => state.app.themeColor
    })
  }
};


</script>

<style lang="scss" scoped>
.login-container {
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-border-radius: 5px;
  background-clip: padding-box;
  margin: 100px auto;
  width: 350px;
  padding: 35px 35px 15px 35px;
  background: #fff;
  border: 1px solid #eaeaea;
  box-shadow: 0 0 25px #cac6c6;
  .title {
    margin: 0px auto 30px auto;
    text-align: center;
    color: #505458;
  }
  .remember {
    margin: 0px 0px 35px 0px;
  }
   .el-tree-node{
      .el-tree-node__content>label.el-checkbox {
          display: none;
      }
  }
}
</style>
<style  scoped>
/deep/ .form .el-input__inner {
  width: 880px !important;
}
.form .el-textarea__inner {
  width: 880px !important;
}
 .form .item {
    padding: -5px 0;
  }
  /deep/.distpicker-address-wrapper select {
    padding: .5rem .75rem;
    height: 34px;
    font-size: 0.8rem;
    width: 290px;
}
.form .el-form-item--small.el-form-item {
    margin-bottom: 13px;
}
.contentStyle {
  position: relative;
  padding: 15px 0px 15px 0px;
  max-height: 600px;
  overflow-y: scroll;
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}
</style>
